<%@ page language="java" import="java.util.*"%>
<%@ page session="true"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="t"%>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>  
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="../../template/estilos.jsp"%>
<%@include file="../../template/script.jsp" %>
<script src="${pageContext.request.contextPath}/resources/assets/scripts/module/countryProvider.js" type="text/javascript" ></script>
 <title>Insert title here</title>
 <script>
     var FormSamples = function () {


    return {
        //main function to initiate the module
        init: function () {

            // use select2 dropdown instead of chosen as select2 works fine with bootstrap on responsive layouts.
            $('.select2_category').select2({
	            placeholder: "Select an option",
	            allowClear: true
	        });

            $('.select2_sample1').select2({
                placeholder: "Select a State",
                allowClear: true
            });

            $(".select2_sample2").select2({
                placeholder: "Type to select an option",
                allowClear: true,
                minimumInputLength: 1,
                query: function (query) {
                    var data = {
                        results: []
                    }, i, j, s;
                    for (i = 1; i < 5; i++) {
                        s = "";
                        for (j = 0; j < i; j++) {
                            s = s + query.term;
                        }
                        data.results.push({
                            id: query.term + i,
                            text: s
                        });
                    }
                    query.callback(data);
                }
            });

            $(".select2_sample3").select2({
                tags: ["red", "green", "blue", "yellow", "pink"]
            });

        }

    };

}();
     </script>
</head>

<body class="page-header-fixed">
    <!--form action="#" name="listCountry" -->   
    <%@include file="../../template/header.jsp"%>
        <!--div class="page-container" -->
            
          <div class="page-container"> 
              <%@include file="../../template/sidebar.jsp"%>
            <div class="page-content">
              <form:form action="newsave"  id="form"  method="post"  class="form-horizontal">
                  
                <%@include file="../../template/header_module.jsp"%>
               <div class="row-fluid">
					<div class="span12">
						<!-- BEGIN EXAMPLE TABLE PORTLET-->
                                                <div class="container-fluid">
						<div class="portlet box grey">
							<div class="portlet-title">
								<div class="caption"><i class="icon-plus"></i>New Country Provider</div>
								 
							</div>
							<div class="portlet-body">
                                                            
                                                             <div class="control-group">
								<label class="control-label">Code : &nbsp;</label>
                                                                <input class="m-wrap medium"  type="text" name="countryProviderCode" id="countryProviderCode"  />
                                                            </div> 
                                                            <div class="control-group" id="select2-drop">
							     <label class="control-label"  >Country : &nbsp;</label>
							     <div class="controls" >
								<select class="span3 select2_category" id="CboCountry" name="CboCountry" data-placeholder="Choose a Country" tabindex="1">
								 <option value=""></option>
								 <c:forEach var="val" items="${country}">
                                                                         <option value="${val.id}">${val.name.trim()}</option>
                                                                 </c:forEach> 
							       </select>
						             </div>
                                                            </div>
                                                            
                                                            <div class="control-group" id="select2-drop">
							     <label class="control-label"  >Provider : &nbsp;</label>
							     <div class="controls" >
								<select class="span3 select2_category" id="CboProvider" name="CboProvider" data-placeholder="Choose a Provider" tabindex="2">
								 <option value=""></option>
								 <c:forEach var="val" items="${provider}">
                                                                         <option value="${val.id}">${val.name.trim()}</option>
                                                                 </c:forEach> 
							       </select>
						             </div>
                                                            </div>
                                                            
                                                             <div class="control-group"> 
                                                               <div class="controls">
                                                               </div>
                                                            </div>  
                                                            <div class="control-group"> 
                                                               <div class="controls">
                                                                 <a class="btn blue"  data-toggle='modal' onclick="validateForm();" href="#static"><i class="icon-ok"></i> Save</a>
                                                                 <a href="index"><button class="btn red" type="button"><i class="icon-remove"></i> Cancel</button></a>
							       </div>
                                                            </div>     
                                           
							</div> 
							</div>
						</div>
                                              </div> 
                                       
					</div> 
				</div>
             <div id="static" class="modal hide fade" tabindex="-1" data-backdrop="static" data-keyboard="false">
                                    <div class="modal-body" id="bodyMessage">
					<p >Are you sure do you want delete this network?</p>
                                    </div>
                                    <div class="modal-footer">
                                    <button type="button" data-dismiss="modal" class="btn black">Ok</button>
                                    </div>    
                                </div> 
                  <c:forEach var="system" items="${dataSystem}"> 
                      <input type="hidden" value="${system.id}" name="createdBy" id="createdBy" /> 
                      <input type="hidden" value="${system.id}" name="ownerId" id="ownerId" /> 
                      
                  </c:forEach>  
                  <input type="hidden" value="<%=request.getParameter("module") %>" name="module" id="module"/>
               </form:form>
            </div>
        </div> 
        <%@include file="../../template/footer.jsp"%> 
        <script>
		jQuery(document).ready(function() {       
	 
                   FormSamples.init();

		});
	</script>
    </body>
</html>



